<template>
	<view class="product">
		<rf-product-detail v-if="dataLoaded" @product="getProductDetail" :userInfo="userInfo" :url="currentUrl" :product="productDetail"></rf-product-detail>
		<!--回到顶部-->
		<rf-back-top :scrollTop="scrollTop"></rf-back-top>
		<!-- 404页面 -->
		<view v-if="productDetail.sku &&!productDetail.sku.name && !loading">
			<rf-no-data :custom="true">
				<view class="no-data-title">
					{{ errorInfo || '暂无数据' }}
				</view>
				<view @tap="getProductDetail(productDetail.id)" slot="refresh" class="spec-color">重新加载</view>
			</rf-no-data>
		</view>
		<!--顶部下拉菜单-->
		<rf-nav-detail @hide="hideNavDetail" :popupShow="navDetailShow"></rf-nav-detail>

		<!--页面加载动画-->
		<rfLoading isFullScreen :active="loading"></rfLoading>
	</view>
</template>
<script>
/**
 * @des 商品详情
 *
 * @author stav stavyan@qq.com
 * @date 2020-03-23 15:04
 * @copyright 2019
 */
import {productDetail} from '@/api/product';
import {addbrowserecord} from '@/api/userInfo';
import rfProductDetail from '@/components/rf-product-detail';
import rfBackTop from '@/components/rf-back-top';
import rfNoData from '@/components/rf-no-data';
export default {
	components: {
		rfProductDetail,
		rfBackTop,
		rfNoData
	},
	data() {
		return {
			productDetail: {},
			loading: true,
			errorInfo: '',
			userInfo: {},
			scrollTop: 0,
			currentUrl: '',
			navDetailShow: false,
			appName: this.$mSettingConfig.appName,
			dataLoaded:false
		};
	},
	// #ifndef MP
	onNavigationBarButtonTap(e) {
		const index = e.index;
		if (index === 0) {
			this.navDetailShow = true;
		}
	},
	// #endif
	onPageScroll(e) {
		this.scrollTop = e.scrollTop;
	},
	async onLoad(options) {
		this.productId = options.id;
		this.userInfo = uni.getStorageSync('userInfo') || {};
		await this.initData();
	},
	methods: {
		// 隐藏顶部导航
		hideNavDetail() {
			this.navDetailShow = false;
		},
		// 数据初始化
		async initData() {
			if (this.userInfo.promo_code) {
				this.currentUrl = `${this.$mConfig.hostUrl}/pages/product/product?id=${this.productId}&promo_code=${this.userInfo.promo_code}`;
			} else {
				this.currentUrl = `${this.$mConfig.hostUrl}/pages/product/product?id=${this.productId}`;
			}
			this.hasLogin = this.$mStore.getters.hasLogin;
			await this.getProductDetail();
		},
		// 获取产品详情
		async getProductDetail() {
			await this.$http.get(`${productDetail}`, {params: {goodsId: this.productId
						// id: this.productId
						//	skuId: 159644443469320
					}
				}).then(async r => {
					this.dataLoaded = true;
					this.loading = false;
					this.productDetail = r;
					if (!this.productDetail) {
						this.$mHelper.toast('商品不存在或者已下架');
						this.$mRouter.push('/pages/index/index');
						//  this.$mHelper.backToLogin();
					}
					await this.addbrowserecord(r.sku.id)
					uni.setNavigationBarTitle({title: r.sku.name});
					//	await this.$mHelper.handleWxH5Share(this.appName, r.sku.name, this.currentUrl, r.picture);
				}).catch(err => {
					this.dataLoaded = true;
					this.loading = false;
					this.errorInfo = err;
				});
		},
		async addbrowserecord(skuId) {
			await this.$http
				.get(`${addbrowserecord}`, {
					params: {
						skuId: skuId
					}
				})
				.then(async r => {
				})
				.catch(err => {
					this.loading = false;
					this.errorInfo = err;
				});
		}
	}
};
</script>
<style scoped lang="scss">
page {
	background: $page-color-base;
}
</style>
